 // ol 下的 li绑定点击事件
 $('.floorNav > li').click(function(){
    // $(this).addClass('active').siblings().removeClass('active')
    const index = $(this).index()           
    // 找到 ul 内对应的 li
    const li = $('.producList > div').eq(index)
    // 让li 在页面的顶部
    // 让浏览器滚动到当前 li 距离文档流顶部的尺寸
    // offset 方法专门获取元素相对于文档流左上角的偏移量
    $('html, body').animate({ scrollTop: li.offset().top},500)
    
})
// 滚动 ,根据滚动的尺寸,来决定 ol 下的哪一个 li 添加类名
$(window).scroll(()=>{
    // 拿到浏览器卷去的高度
    const scrollTop = document.documentElement.scrollTop || document.body.scrollTop
    if(scrollTop === 0){
        $('.floorNav').addClass('a')
    }else{
        if(scrollTop < 850){
            $('.floorNav').addClass('a').removeClass('b')
        }else{
            $('.floorNav').removeClass('a').addClass('b')
        }
    }
    
    // 卷去高度 >= li 距离页面顶部的尺寸 ol>li有类名
    // JQuery 遍历元素集合, each()
    $('.producList > div').each(function(index,item){
        if(scrollTop > $(item).last().offset().top){
            $('.floorNav > li').removeClass('active')
        }
        if(scrollTop >= $(item).offset().top-100){
            $('.floorNav > li').eq(index).addClass('active').siblings().removeClass('active')
        }
       
        const s_d = scrollTop - $('.producList > div').last().height()
    const _d = $('.producList > div').last().offset().top

   if(s_d  > _d ){
    $('.floorNav > li').removeClass('active')
    
   }
    
      
    })

})
$('.floorNav > span').click(function(){
    $('html, body').animate({ scrollTop: 0 }, 1000)
})